package com.turman.coroutionsample.view

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material.CircularProgressIndicator
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.paging.LoadState
import androidx.paging.compose.collectAsLazyPagingItems
import coil.compose.rememberImagePainter
import com.google.accompanist.swiperefresh.SwipeRefresh
import com.google.accompanist.swiperefresh.SwipeRefreshIndicator
import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
import com.turman.coroutionsample.R
import com.turman.coroutionsample.net.InfoItem
import com.turman.coroutionsample.ui.theme.CoroutionSampleTheme
import com.turman.coroutionsample.viewmodel.PagingViewModel

@Composable
fun PagingFlowView() {
    val viewModel = viewModel<PagingViewModel>()
    val list = viewModel.loadData().collectAsLazyPagingItems()
    CoroutionSampleTheme {
        Surface(modifier = Modifier.fillMaxSize()) {
            SwipeRefresh(
                indicator = { state, triger ->
                    SwipeRefreshIndicator(
                        state = state,
                        refreshTriggerDistance = triger,
                        contentColor = MaterialTheme.colors.primary,
                        scale = true
                    )
                },
                state = rememberSwipeRefreshState((list.loadState.refresh is LoadState.Loading && list.itemCount > 0)),
                onRefresh = { list.refresh() }) {
                LazyColumn {
                    items(list.itemCount) {
                        list?.get(it)?.let {
                            ItemView(info = it)
                        }
                    }
                    if (list.loadState.append is LoadState.Loading) {
                        //下一页的load状态
                        item {
                            Box(
                                modifier = Modifier
                                    .fillMaxWidth()
                                    .height(50.dp)
                            ) {
                                LoadingView()
                            }
                        }
                    }
                }
            }
        }
    }
}

@Composable
fun ItemView(info: InfoItem) {
    val painter = rememberImagePainter(data = info.owner.avatar_url) {
        crossfade(durationMillis = 1000)
        error(R.drawable.img)
        placeholder(R.drawable.img)
    }
    Row(modifier = Modifier.fillMaxWidth()) {
        Image(
            painter = painter,
            contentDescription = "",
            modifier = Modifier.size(80.dp),
            contentScale = ContentScale.Crop
        )
        Spacer(modifier = Modifier.width(10.dp))
        Text(text = info.full_name)
    }
}

@Composable
fun LoadingView() {
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .padding(10.dp),
        horizontalArrangement = Arrangement.Center,
        verticalAlignment = Alignment.CenterVertically
    ) {
        CircularProgressIndicator(modifier = Modifier.size(20.dp), strokeWidth = 3.dp)
        Spacer(modifier = Modifier.width(10.dp))
        Text(
            text = "Loading more...",
            color = MaterialTheme.colors.primary,
            style = MaterialTheme.typography.body2
        )
    }
}
